<template>
  <div class="btnDialog">
    <div>
      <el-button size="small"
                 :disabled="$store.state.flowInvoice.selectedItems && !$store.state.flowInvoice.selectedItems.length"
                 @click="openInvoice(true)">开具专票
      </el-button>
      <el-button size="small"
                 :disabled="$store.state.flowInvoice.selectedItems && !$store.state.flowInvoice.selectedItems.length"
                 @click="openInvoice">开具普票
      </el-button>
      <el-button size="small" @click="lookFlow"
                 :disabled="$store.state.flowInvoice.selectedItems && $store.state.flowInvoice.selectedItems.length !== 1">
        查看流水
      </el-button>
    </div>


    <!-- 发票 -->
    <invoicingDialog :invoicingSpectShow="invoicingSpectShow" :invoicingPlainShow="invoicingPlainShow"
                     @invoicingShow="invoicingShow"></invoicingDialog>
    <!-- 查看流水 -->
    <lookFlowDialog v-model="lookFlowShow"></lookFlowDialog>

  </div>
</template>
<script>
import lookFlowDialog from './lookFlowDialog.vue'
import invoicingDialog from './invoicingDialog.vue'

export default {
  data() {
    return {
      lookFlowShow: false,
      invoicingSpectShow: false,
      invoicingPlainShow: false,

    }
  },
  methods: {
    lookFlow() {
      this.lookFlowShow = true
    },
    openInvoice(isSpec) {
      if (isSpec === true) {
        this.invoicingSpectShow = true
        this.invoicingPlainShow = false
      } else {
        this.invoicingSpectShow = false
        this.invoicingPlainShow = true
      }

    },

    invoicingShow(val) {
      this.invoicingSpectShow = val
      this.invoicingPlainShow = val
      this.$store.dispatch('flowInvoice/getList')
    },
  },
  components: {
    lookFlowDialog,
    invoicingDialog,
  }
}
</script>

<style lang="scss" scoped>
.btnDialog {
  margin-bottom: 6px;
}
</style>